<template>
  <div>
    <div class="app-container">
      <el-form size="mini" ref="postForm" :inline="true" :model="postForm" :label-position="'right'" label-width="80px">
        <el-row type="flex" justify="space-between" :gutter="20">
          <el-form-item/>
          <el-form-item>
            <el-button v-if="!isShow" type="warning" size="mini" @click="centerDialogVisible2=true">
              新增
            </el-button>
          </el-form-item>
        </el-row>
      </el-form>
      <el-table :height="tableHeight" :data="tableData" stripe border width="100%">
        <el-table-column type="index" align="center" width="50"></el-table-column>
        <el-table-column prop="type" label="表名称" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.type==1">工作场所空气中有毒物质定点采样记录表</span>
            <span v-if="scope.row.type==2">工作场所空气中有毒物质个体采样记录表</span>
            <span v-if="scope.row.type==3">工作场所空气中粉尘定点采样记录表</span>
            <span v-if="scope.row.type==4">工作场所空气中粉尘个体采样记录表</span>
            <span v-if="scope.row.type==5">工作场所工频电场测量记录表</span>
            <span v-if="scope.row.type==6">工作场所高频电磁场测量记录表</span>
            <span v-if="scope.row.type==7">工作场所超高频辐射测量记录表</span>
            <span v-if="scope.row.type==8">工作场所激光辐射测量记录表</span>
            <span v-if="scope.row.type==9">作场所微波辐射测量记录表</span>
            <span v-if="scope.row.type==10">工作场所紫外辐射测量记录表</span>
            <span v-if="scope.row.type==11">工作场所高温测量记录表（一）</span>
            <span v-if="scope.row.type==12">工作场所高温测量记录表（二）</span>
            <span v-if="scope.row.type==13">工作场所噪声测量记录表</span>
            <span v-if="scope.row.type==14">工作场所脉冲噪声测量记录表</span>
            <span v-if="scope.row.type==15">工作场所个体噪声测量记录表</span>
            <span v-if="scope.row.type==16">工作场所物理因素定点测量记录表（手传振动）</span>
            <span v-if="scope.row.type==17">工作场所噪声频谱分析测量记录表</span>
            <span v-if="scope.row.type==18">工作场所气象条件定点测量记录表</span>
            <span v-if="scope.row.type==19">工作场所空气中有毒物质现场测定记录表</span>
            <span v-if="scope.row.type==20">工作场所照度测量记录表</span>
          </template>
        </el-table-column>
        <el-table-column prop="jcxm" label="检测项目" align="center"/>
        <el-table-column prop="jclx" label="检测类型" align="center"/>
        <el-table-column prop="cyyj" label="采样依据" align="center"/>
        <el-table-column prop="cyrq" label="采样日期" align="center"/>
        <el-table-column prop="cyyq" label="采样仪器" align="center"/>
        <el-table-column prop="type" label="完成状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.schedule==1">未完成</span>
            <span v-if="scope.row.schedule==2">已更新</span>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="80">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="showInfo(scope.$index,scope.row)">
              查看
            </el-button>
            <el-button v-if="!isShow" type="text" size="small"
                       @click="del(scope.$index,scope.row)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-dialog :visible.sync="centerDialogVisible2" center append-to-body modal-append-to-body width="40%">
        <el-form size="mini" :label-position="'right'"
                 label-width="80px">
          <el-form-item label="表类型:" prop="type">
            <el-radio-group v-model="type">
              <el-row style="padding: 5px">
                <el-radio :label="1">工作场所空气中有毒物质定点采样记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="2">工作场所空气中有毒物质个体采样记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="3">工作场所空气中粉尘定点采样记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="4">工作场所空气中粉尘个体采样记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="5">工作场所工频电场测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="6">工作场所高频电磁场测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="7">工作场所超高频辐射测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="8">工作场所激光辐射测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="9">作场所微波辐射测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="10">工作场所紫外辐射测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="11">工作场所高温测量记录表（一）</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="12">工作场所高温测量记录表（二）</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="13">工作场所噪声测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="14">工作场所脉冲噪声测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="15">工作场所个体噪声测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="16">工作场所物理因素定点测量记录表（手传振动）</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="17">工作场所噪声频谱分析测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="18">工作场所气象条件定点测量记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="19">工作场所空气中有毒物质现场测定记录表</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="20">工作场所照度测量记录表</el-radio>
              </el-row>
            </el-radio-group>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button size="mini" @click="centerDialogVisible2 = false">取 消</el-button>
          <el-button size="mini" type="primary" @click="add()">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog
        :visible.sync="centerDialogVisible"
        center
        modal-append-to-body
        append-to-body
        width="96%"
      >
        <table41 v-if="type==1" ref="table41" :isShow="isShow" :no-created="true"/>
        <table42 v-if="type==2" ref="table42" :isShow="isShow" :no-created="true"/>
        <table43 v-if="type==3" ref="table43" :isShow="isShow" :no-created="true"/>
        <table44 v-if="type==4" ref="table44" :isShow="isShow" :no-created="true"/>
        <table45 v-if="type==5" ref="table45" :isShow="isShow" :no-created="true"/>
        <table46 v-if="type==6" ref="table46" :isShow="isShow" :no-created="true"/>
        <table47 v-if="type==7" ref="table47" :isShow="isShow" :no-created="true"/>
        <table48 v-if="type==8" ref="table48" :isShow="isShow" :no-created="true"/>
        <table49 v-if="type==9" ref="table49" :isShow="isShow" :no-created="true"/>
        <table410 v-if="type==10" ref="table410" :isShow="isShow" :no-created="true"/>
        <table411 v-if="type==11" ref="table411" :isShow="isShow" :no-created="true"/>
        <table412 v-if="type==12" ref="table412" :isShow="isShow" :no-created="true"/>
        <table413 v-if="type==13" ref="table413" :isShow="isShow" :no-created="true"/>
        <table414 v-if="type==14" ref="table414" :isShow="isShow" :no-created="true"/>
        <table415 v-if="type==15" ref="table415" :isShow="isShow" :no-created="true"/>
        <table416 v-if="type==16" ref="table416" :isShow="isShow" :no-created="true"/>
        <table417 v-if="type==17" ref="table417" :isShow="isShow" :no-created="true"/>
        <table418 v-if="type==18" ref="table418" :isShow="isShow" :no-created="true"/>
        <table419 v-if="type==19" ref="table419" :isShow="isShow" :no-created="true"/>
        <table420 v-if="type==20" ref="table420" :isShow="isShow" :no-created="true"/>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import table41 from '@/views/table/table4-1'
import table42 from '@/views/table/table4-2'
import table43 from '@/views/table/table4-3'
import table44 from '@/views/table/table4-4'
import table45 from '@/views/table/table4-5'
import table46 from '@/views/table/table4-6'
import table47 from '@/views/table/table4-7'
import table48 from '@/views/table/table4-8'
import table49 from '@/views/table/table4-9'
import table410 from '@/views/table/table4-10'
import table411 from '@/views/table/table4-11'
import table412 from '@/views/table/table4-12'
import table413 from '@/views/table/table4-13'
import table414 from '@/views/table/table4-14'
import table415 from '@/views/table/table4-15'
import table416 from '@/views/table/table4-16'
import table417 from '@/views/table/table4-17'
import table418 from '@/views/table/table4-18'
import table419 from '@/views/table/table4-19'
import table420 from '@/views/table/table4-20'

import {del, getTable4List} from '@/api/table/tableFour'
import fileUpdate from '@/components/Upload/fileUpdate'
import {getUserId} from '@/utils/auth'

export default {
  components: {
    fileUpdate,
    table41,
    table42,
    table43,
    table44,
    table45,
    table46,
    table47,
    table48,
    table49,
    table410,
    table411,
    table412,
    table413,
    table414,
    table415,
    table416,
    table417,
    table418,
    table419,
    table420
  },
  props: {
    noCreated: {
      type: Boolean,
      default: null
    },
    isShow: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      tableHeight: window.innerHeight - 180,
      qiniuDataObj: {token: ''},
      fileUrl: process.env.VUE_APP__FILE_URL,
      // 总条数
      total: 0,
      type: 1,
      // 每页显示个数
      pageSize: 15,
      // 页码
      currentPage: 1,
      // 查询条件
      postForm: {},
      // 查询条件
      selectForm: {},
      // 列表数据
      tableData: [],
      userId: getUserId(),
      typeList: [],
      // 编辑下标
      editIndex: 0,
      // 是否展示表单
      centerDialogVisible: false,
      centerDialogVisible2: false,
      // 表单标题
      title: null,
      table1Id: null,
      // 银行
      rules: {
        rewards: [{required: true, message: '请输入内容', trigger: 'chang'}],
        tagName: [{required: true, message: '请输入内容', trigger: 'chang'}],
        claim: [{required: true, message: '请输入内容', trigger: 'chang'}],
        name: [{required: true, message: '请输入内容', trigger: 'chang'}],
        taskTypeId: [{required: true, message: '你选择内容', trigger: 'chang'}],
        dataJson: [{required: true, message: '请上传文件', trigger: 'chang'}]
      }
    }
  }
  ,
  created() {
    if (!this.noCreated) {
      this.getData()
    }
  }
  ,
  methods: {
    handleSizeChange(val) {
      this.pageSize = val
    }
    ,
    // 初始化
    init(id, userId) {
      this.table1Id = id
      this.getData()
    }
    ,
    add() {
      this.centerDialogVisible = true
      this.centerDialogVisible2 = false
      this.$nextTick(() => {
        if (this.type == 1) {
          this.$refs.table41.init(null, this.table1Id)
        }
        if (this.type == 2) {
          this.$refs.table42.init(null, this.table1Id)
        }
        if (this.type == 3) {
          this.$refs.table43.init(null, this.table1Id)
        }
        if (this.type == 4) {
          this.$refs.table44.init(null, this.table1Id)
        }
        if (this.type == 5) {
          this.$refs.table45.init(null, this.table1Id)
        }
        if (this.type == 6) {
          this.$refs.table46.init(null, this.table1Id)
        }
        if (this.type == 7) {
          this.$refs.table47.init(null, this.table1Id)
        }
        if (this.type == 8) {
          this.$refs.table48.init(null, this.table1Id)
        }
        if (this.type == 9) {
          this.$refs.table49.init(null, this.table1Id)
        }
        if (this.type == 10) {
          this.$refs.table410.init(null, this.table1Id)
        }
        if (this.type == 11) {
          this.$refs.table411.init(null, this.table1Id)
        }
        if (this.type == 12) {
          this.$refs.table412.init(null, this.table1Id)
        }
        if (this.type == 13) {
          this.$refs.table413.init(null, this.table1Id)
        }
        if (this.type == 14) {
          this.$refs.table414.init(null, this.table1Id)
        }
        if (this.type == 15) {
          this.$refs.table415.init(null, this.table1Id)
        }
        if (this.type == 16) {
          this.$refs.table416.init(null, this.table1Id)
        }
        if (this.type == 17) {
          this.$refs.table417.init(null, this.table1Id)
        }
        if (this.type == 18) {
          this.$refs.table418.init(null, this.table1Id)
        }
        if (this.type == 19) {
          this.$refs.table419.init(null, this.table1Id)
        }
        if (this.type == 20) {
          this.$refs.table420.init(null, this.table1Id)
        }
      })
    }
    ,
    // 分页查询
    handleCurrentChange(val) {
      this.currentPage = val
      this.getData()
    }
    ,
    // 查询条件
    query() {
      this.selectForm = this.postForm
      this.currentPage = 1
      this.getData()
    }
    ,
    getData() {
      // 请求分页参数
      getTable4List(this.table1Id).then(response => {
        this.tableData = response.data
      })
    }
    ,
    // 查看
    showInfo(index, row) {
      this.type = row.type
      this.editIndex = index
      this.centerDialogVisible = true
      this.$nextTick(() => {
        if (row.type == 1) {
          this.$refs.table41.init(row.id, null)
        }
        if (row.type == 2) {
          this.$refs.table42.init(row.id, null)
        }
        if (row.type == 3) {
          this.$refs.table43.init(row.id, null)
        }
        if (row.type == 4) {
          this.$refs.table44.init(row.id, null)
        }
        if (row.type == 5) {
          this.$refs.table45.init(row.id, null)
        }
        if (row.type == 6) {
          this.$refs.table46.init(row.id, null)
        }
        if (row.type == 7) {
          this.$refs.table47.init(row.id, null)
        }
        if (row.type == 8) {
          this.$refs.table48.init(row.id, null)
        }
        if (row.type == 9) {
          this.$refs.table49.init(row.id, null)
        }
        if (row.type == 10) {
          this.$refs.table410.init(row.id, null)
        }
        if (row.type == 11) {
          this.$refs.table411.init(row.id, null)
        }
        if (row.type == 12) {
          this.$refs.table412.init(row.id, null)
        }
        if (row.type == 13) {
          this.$refs.table413.init(row.id, null)
        }
        if (row.type == 14) {
          this.$refs.table414.init(row.id, null)
        }
        if (row.type == 15) {
          this.$refs.table415.init(row.id, null)
        }
        if (row.type == 16) {
          this.$refs.table416.init(row.id, null)
        }
        if (row.type == 17) {
          this.$refs.table417.init(row.id, null)
        }
        if (row.type == 18) {
          this.$refs.table418.init(row.id, null)
        }
        if (row.type == 19) {
          this.$refs.table419.init(row.id, null)
        }
        if (row.type == 20) {
          this.$refs.table420.init(row.id, null)
        }
      })
    }
    ,
    // 删除
    del(index, row) {
      this.$confirm('是否删除该数据', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        del(row.id).then(response => {
          this.tableData.splice(index, 1, row)
          this.$notify({
            title: '成功',
            message: '操作成功',
            type: 'success',
            duration: 2000
          })
          this.getData()
        })
      })
    }
  }
}
</script>

